<% add_decidim_page_title(t("components.title", scope: "decidim.admin")) %>

<div class="card">
  <div class="item_show__header">
    <h1 class="item_show__header-title">
      <%= t("components.title", scope: "decidim.admin") %>

      <% if allowed_to?(:create, :component) %>
      <div class="relative">
        <button class="button button__sm button__secondary" data-controller="dropdown" data-target="add-component-dropdown">
          <%= t "components.index.add", scope: "decidim.admin" %>
          <%= icon "arrow-down-s-line", class: "!fill-white" %>
          <%= icon "arrow-down-s-line", class: "!fill-white" %>
        </button>
        <ul class="dropdown" id="add-component-dropdown" aria-hidden="true">
          <% @manifests.each do |manifest| %>
          <li class="dropdown__item">
            <%= link_to new_component_path(type: manifest.name), class: "dropdown__button" do %>
              <%= t("#{manifest.name}.name", scope: "decidim.components") %>
            <% end %>
          </li>
        <% end %>
        </ul>
      </div>
      <% end %>
    </h1>
  </div>

  <%= render partial: "components_table", locals: { components: @components, view: :index } %>
  <% if allowed_to?(:manage_trash, :component, participatory_space: current_participatory_space) %>
    <div class="card mt-4">
      <%= link_to manage_trash_components_path, class: "flex items-center  text-secondary" do %>
        <%= icon "delete-bin-2-line", class: "mr-2 fill-current text-secondary", role: "img" %>
        <%= t("actions.view_deleted_components", scope: "decidim.admin") %>
        <span class="ml-2">
        <%= icon_with_tooltip("information-line", t("tooltips.deleted_component_info", scope: "decidim.admin")) %>
      </span>
      <% end %>
    </div>
  <% end %>
</div>
